import CartProInfo from "./CartProInfo";
import CartCheckBox from "./CartCheckBox";
import CartProItemExpire from "./CartProItemExpire";
import CommonUtils from '@page/common/utils/CommonUtils'

import EventEmitterUtils from "../../common/utils/EventEmitterUtils";

export default class CartProItem extends React.Component {
    constructor() {
        super();
        this.state = {
            list_selected: false,
            for_list_header: false
        };
    }

    componentWillReceiveProps(nextProps) {
        this.isChecked(nextProps);
    }

    isChecked(nextProps) {
        if (nextProps.is_for_header) {
            return;
        }
        if (!this.props.all_selected && nextProps.all_selected) {
            this.setState({
                list_selected: true
            });
            return;
        }
        if (this.props.all_selected && !nextProps.all_selected) {
            this.setState({
                list_selected: false
            });
            return;
        }
    }

    isShowAllSelected() {
        const { showAllSelected } = this.props;
        const listEles = document.querySelectorAll(`.cart-pro-item-comp`);
        const checkedEles = document.querySelectorAll(
            `.cart-pro-item-comp .cart-content-box-gouxuan1`
        );

        if (listEles && checkedEles && listEles.length == checkedEles.length) {
            showAllSelected();
        }

        EventEmitterUtils.emit("cartChoosedTotalCountChange", null);
    }

    isAllExpire(products_){
        if(products_&&products_.length>0){
            let isExpire=true
            for(let i=0; i<products_.length;i++){
                let item=products_[i]
                if(item.allowPurchase){
                    isExpire=false
                    break
                }
            }
            return isExpire
        }
        return true

    }

    render() {
        const { all_selected, hideAllSelected, index, item } = this.props;

        const { list_selected, for_list_header } = this.state;
        const { cart, supplier, suppName, products,suppId } = item;
        const products_ = global.hasLogin ? cart : products;

        let isAlProductsExpire=this.isAllExpire(products_)

        if (global.hasLogin&&isAlProductsExpire) {
            //产品失效
            return <CartProItemExpire item={item} products={products_} suppId={global.hasLogin ? supplier.id : suppId} />;
        }

        return (
            <div className={"cart-pro-item"}>
                <div className={"cart-pro-item-comp"}>
                    <CartCheckBox
                        selected={list_selected}
                        onClick={() => {
                            if (all_selected) {
                                hideAllSelected();
                            }
                            this.setState(
                                {
                                    list_selected: !list_selected
                                },
                                this.isShowAllSelected
                            );
                        }}
                    />
                    <p dangerouslySetInnerHTML={{__html: global.hasLogin ? supplier.name  : suppName}}></p>
                </div>
                <div
                    className={
                        list_selected
                            ? "cart-pro-item-content-wrapper1"
                            : "cart-pro-item-content-wrapper"
                    }
                >
                    {products_ &&
                        products_.map((info, idx) => (
                            <CartProInfo
                                suppId={global.hasLogin ? supplier.id : suppId}
                                key={`${index}-${idx}`}
                                all_selected={all_selected}
                                list_selected={list_selected}
                                for_list_header={for_list_header}
                                hasBottomLine={idx < products_.length - 1}
                                index={index}
                                info={info}
                                hideListSelected={() => {
                                    if (all_selected) {
                                        hideAllSelected();
                                    }
                                    this.setState({
                                        list_selected: false,
                                        for_list_header: true
                                    });
                                    setTimeout(() => {
                                        this.setState({
                                            for_list_header: false
                                        });
                                    }, 300);
                                }}
                                showListSelected={() => {
                                    this.setState(
                                        {
                                            list_selected: true,
                                            for_list_header: true
                                        },
                                        this.isShowAllSelected
                                    );
                                    setTimeout(() => {
                                        this.setState({
                                            for_list_header: false
                                        });
                                    }, 300);
                                }}
                            />
                        ))}
                </div>
            </div>
        );
    }
}
